import React from 'react'
class AndBox extends React.Component {
    render() {
        console.log(this.props); //打印传递过来的数组
        let { abc } = this.props //将数组从传递过来的数据中结构
        return (
            <fieldset>
                <legend>&&运算符</legend>
                {/* 因为&&&运算符需要两边的结果都是true ,才能返回true ,我们传递的数据,数组的长度是7,而第一个条件abc.Length>0
                是成立的,但是这个成立不能保证&&的结果,所以还会继续执行到后面哪句 abc.length, 判断它是否成立,不管后面的条
                件成立与否,都会执行到后面那句代码
                如果第一个条件是false, &&直接返回fa lse ,就没有必要执行到第二句代码 */}
                <h1>你还有{abc.length > 0 && abc.length}锋邮件未读</h1>
                {/* &&运算符要保证符号两边都是true，并且执行的是符号后面的这一句 */}
            </fieldset>
        )
    }
}
export default AndBox